<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<link href="css/register.css" rel="stylesheet" />
	</head>

	<body>
		<script src="js/mui.js"></script>
		<script type="text/javascript">
			mui.init()
		</script>
		<div class="mui-content">
			<header class="mui-bar mui-bar-nav">
				<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
				<h1 class="mui-title">找回密码</h1>
			</header>
			<form class="mui-input-group form_input">
				<div class="mui-input-row">
					<label>手机</label>
					<input id="u_email" type="text" class="mui-input-clear email" placeholder="请输入手机" name="email" id="" value="" />
				</div>
				<div class="mui-input-row">
					<label>验证码</label>
					<input id="u_tel_code" type="text" class="mui-input-clear tel_code" placeholder="请输入验证码" name="tel_code" id="" value="" />
					<button type="button"  id="my_btn" class="mui-btn mui-btn-blue mui-btn-block">获取验证码</button>
				</div>
				<div class="mui-input-row">
					<label>新密码</label>
					<input id="u_password" type="password" class="mui-input-password password" placeholder="请输入密码" name="email" id="" value="" />
				</div>
				<div class="mui-button-row submit">
					<button id="register_btn" type="button" class="mui-btn mui-btn-primary">确定</button>
					<button id="exit_btn" type="button" class="mui-btn mui-btn-danger">取消</button>
				</div>
			</form>
			
			<div id="forword">
				<a class="f2" id="f" style="margin-left: 255px;">遇到问题?</a>
			</div>
		</div>
		
		<script type="text/javascript">
			
			document.getElementById('f').addEventListener('tap',function(){
				mui.openWindow({
					url: 'help_page.html',
					id: 'help_page.html',
				})
			})
			
			document.getElementById("u_email").addEventListener('input',function(){
				var re1 = /^1[3-9][0-9]{9}$/
				var bro = this.parentNode.firstElementChild;
				if(re1.test(this.value)){
					bro.style.background = 'url(images/input_success.png) no-repeat 80px 10px';
					bro.style.backgroundSize = '20px 20px'
				}else{
					bro.style.background = 'url(images/input_error.png) no-repeat 80px 10px';
					bro.style.backgroundSize = '20px 20px'
				}
			});
			
			
			document.getElementById("u_tel_code").addEventListener('input',function(){
				var re1 = /^[0-9]{6}$/
				var bro = this.parentNode.firstElementChild;
				if(re1.test(this.value)){
					bro.style.background = 'url(images/input_success.png) no-repeat 80px 10px';
					bro.style.backgroundSize = '20px 20px'
				}else{
					bro.style.background = 'url(images/input_error.png) no-repeat 80px 10px';
					bro.style.backgroundSize = '20px 20px'
				}
			});
			
			document.getElementById("u_password").addEventListener('input',function(){
				var re2 = /^[A-Za-z][A-Za-z0-9\.]{5,}$/
				var bro = this.parentNode.firstElementChild;
				if(re2.test(this.value)){
					bro.style.background = 'url(images/input_success.png) no-repeat 80px 10px';
					bro.style.backgroundSize = '20px 20px'
				}else{
					bro.style.background = 'url(images/input_error.png) no-repeat 80px 10px';
					bro.style.backgroundSize = '20px 20px'
				}
			});
			
			document.getElementById('my_btn').addEventListener('tap',function(){
				// 检查今日发送次数
				var b = localStorage.getItem('tel_code')
				if(b==null){
					localStorage.setItem('tel_code', 0)
				}else{
					// mui.alert(2)
					if(parseInt(b)>=5){
						mui.toast('今日获取验证码次数达到上限')
						return
					}
				}
				
				this.setAttribute('disabled', 'false')
				var time1 = setTimeout(function(){
					clearInterval(time2)
					document.getElementById('my_btn').removeAttribute('disabled')
					document.getElementById('my_btn').innerText = '获取验证码'
				},121000)
				var time_num = 120
				var time2 = setInterval(function(){
					document.getElementById('my_btn').innerHTML = time_num + '秒后可使用'
					time_num = time_num -1
				},1000)
				var tel = document.getElementById('u_email').value;
				reg1 = /^1[3-9][0-9]{9}$/
				if (!reg1.test(tel)){
					mui.toast('请输入正确的手机号')
					clearInterval(time2)
					document.getElementById('my_btn').removeAttribute('disabled')
					document.getElementById('my_btn').innerText = '获取验证码'
					return
				}
				mui.ajax(localStorage.getItem('request_url')+'cost/get_tel_code/',{
				    data:"tel=" + tel + "&type=is_find",
				    dataType:'json',
				    type:'post',  
				    contentType:"application/x-www-form-urlencoded; charset=utf-8",  
				    timeout:60000,  
				    success:function show(e){
						mui.toast('发送验证码成功')
						var old = parseInt(localStorage.getItem('tel_code'))
						localStorage.setItem('tel_code', (old+1))
					},
				    error:function(xhr,type,errorThrown){
				        // 短信发送失败
						mui.toast('发送验证码失败')
				        var data = JSON.parse(xhr.responseText)
				        mui.toast(data.data.rule,{ duration:'long'})
						clearInterval(time2)
						document.getElementById('my_btn').removeAttribute('disabled')
						document.getElementById('my_btn').innerText = '获取验证码'
				    }  
				});
			});
			
			
			document.getElementById('register_btn').addEventListener('tap',function(){
				var tel = document.getElementById('u_email').value;
				var password = document.getElementById('u_password').value;
				var tel_code = document.getElementById('u_tel_code').value;
				var re1 = /^1[3-9][0-9]{9}$/
				var re2 = /^[0-9]{6}$/
				var re3 = /^[A-Za-z][A-Za-z0-9\.]{5,}$/
				if (!re1.test(tel) || !re2.test(tel_code) || !re3.test(password)){
					mui.toast('请填写完整且符合规则的信息')
					return
				}

				mui.ajax(localStorage.getItem('request_url')+'cost/user/find_my_password/',{
				    data:"tel=" + tel + "&password=" + password + "&tel_code=" + tel_code,
				    dataType:'json',  
				    type:'post',  
				    contentType:"application/x-www-form-urlencoded; charset=utf-8",  
				    timeout:60000,  
				    success:function show(e){
						mui.alert('修改成功~');
						mui.back();
					},  
				    error:function(xhr,type,errorThrown){
				        // mui.toast(typeof xhr.responseText)
						// mui.alert(xhr.responseText)
				        var data = JSON.parse(xhr.responseText)
				        if (data.code==0){
				        	mui.toast('修改失败,您输入信息不符合我们的约定哦')
				        }else{
				        	mui.toast(data.msg)
				        	mui.toast(data.data.rule,{ duration:'long'})
				        }
				    }  
				});
			});
			
			document.getElementById('exit_btn').addEventListener('tap', function(){
				mui.back();
			});
			
		</script>
	</body>

</html>

